<template>
  <div id="app">
    <TheHeader :todo="todo" />
    <TodoItem :todo="todo" />
  </div>
</template>
<script>
import TheHeader from '../src/components/TheHeader.vue'
import TodoItem from '../src/components/TodoItem.vue'
export default {
  components: {
    TheHeader,
    TodoItem,
  },
  mounted() {
    this.getTodo()
  },
  data() {
    return {
      todo: [],
    }
  },
  methods: {
    getTodo() {
      let res = localStorage.getItem('todo')
      if (!res) {
        localStorage.setItem('todo', JSON.stringify([]))
      } else {
        this.todo = JSON.parse(res)
      }
    },
  },
}
</script>
<style scoped></style>
